<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:outline="http://wkhtmltopdf.org/outline"
                xmlns="http://www.w3.org/1999/xhtml">
    <xsl:output doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
                doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
                indent="yes"/>
    <xsl:template match="outline:outline">
        <html>
            <head>
                <title>Table of Contents</title>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
                <style>

                    body {
                    font-family: Times, times;
                    }

                    li {
                    list-style: none;
                    }
                    ul {padding-left: 0em;}
                    ul ul {padding-left: 1em;}
                    a {
                    text-decoration:none;
                    color: black;
                    background:white;
                    }

                    .myPage{
                    float:right;
                    position:absolute;
                    right:0px;
                    background:white;
                    }

                    .row {
                    line-height:2em;
                    display: -webkit-flex;
                    display: -moz-flex;
                    display: -ms-flex;
                    display: flex;
                    -webkit-flex: 1;
                    -moz-flex: 1;
                    -ms-flex: 1;
                    flex: 1;
                    }
                    .row .left {
                    -webkit-order: 1;
                    -moz-order: 1;
                    -ms-order: 1;
                    order: 1;
                    }
                    .row .right {
                    -webkit-order: 3;
                    -moz-order: 3;
                    -ms-order: 3;
                    order: 3;
                    }
                    .row {
                    content: "";
                    margin: 0px 4px;
                    background: -webkit-radial-gradient(50% 50%, circle, black 12%, transparent 15%);
                    background: -moz-radial-gradient(50% 50%, circle, black 12%, transparent 15%);
                    background: radial-gradient(circle at 50% 50%, black 12%, transparent 15%);
                    background-size: 1em 1em;
                    background-position: 0 0.5em;
                    background-repeat: repeat-x;
                    -webkit-flex-grow: 1;
                    -moz-flex-grow: 1;
                    -ms-flex-grow: 1;
                    flex-grow: 1;
                    -webkit-order: 2;
                    -moz-order: 2;
                    -ms-order: 2;
                    order: 2;
                    }
                </style>
            </head>
            <body>
                <h1>目录</h1>
                <ul>
                    <xsl:apply-templates select="outline:item/outline:item"/>
                </ul>
            </body>
        </html>
    </xsl:template>
    <xsl:template match="outline:item">
        <li class="">
            <xsl:if test="@title!=''">
                <div class="myRow row">
                    <a class="myTitle">
                        <xsl:if test="@link">
                            <xsl:attribute name="href">
                                <xsl:value-of select="@link"/>
                            </xsl:attribute>
                        </xsl:if>
                        <xsl:if test="@backLink">
                            <xsl:attribute name="name">
                                <xsl:value-of select="@backLink"/>
                            </xsl:attribute>
                        </xsl:if>
                        <xsl:value-of select="@title"/>
                    </a>
                    <span class="myPage">
                        <xsl:value-of select="@page"/>
                    </span>
                </div>
            </xsl:if>
            <ul>
                <xsl:comment>added to prevent self-closing tags in QtXmlPatterns</xsl:comment>
                <xsl:apply-templates select="outline:item"/>
            </ul>
        </li>
    </xsl:template>
</xsl:stylesheet>
